<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>事件对象</title>
		<style type="text/css">
			*{
				margin:0;
				padding:0;
			}
			#div1{
				width:200px;
				height:60px;
				margin: 100px auto;
				background-color:gainsboro;
				color:black;
				border:2px solid red;
				text-align:center;
				line-height:60px;
				cursor:pointer;
			}
		</style>
		<script type="text/javascript">
			/* 
			事件对象:当触发某个事件时，会产生一个事件对象。这个对象包含着所有与事件相关的信息。
			        包括导致事件的元素，导致事件的类型，以及它与特定事件有关的信息。
			【注】,通过事件绑定的执行函数可以得到一个隐藏的参数，这个参数就是event对象
			 
			 
			 */
			window.onload = function(){
				var oDiv = document.getElementById("div1");
				oDiv.onclick = function(e){
					//在IE浏览器中获取事件对象的写法：window.event
					//在其他浏览器中获取事件对象的写法：e  console.log(e);
					
					//获取事件对象的兼容性写法
					var evt = e || window.event;//(window可以省略)
					console.log(evt);
				}
			}
		</script>
	</head>
	<body>
		<div id="div1">这个世界还是美好的！！！</div>
	</body>
</html>
